<template lang="pug">
.sampleAeeangement
  .sampleAeeangement__left
    mt-card
      .specimen-info
        .specimen-info__title
          SectionTitle(padding="0 8px") 标本信息
        .specimen-info__content
          data-page(
            v-bind="pageParams"
          )
            mt-table(
            v-bind="projectTableProps"
          )
  .sampleAeeangement__right
    mt-card
      .inspection-result
        .inspection-result__title
          SectionTitle(padding="0 8px") 检验结果
        .inspection-result__table
          mt-table(
            v-bind="tableProps"
          )
        .inspection-result__form
          mt-form(
            v-bind="editFormProps"
          )
        .inspection-result__actions
          mt-button(type="primary" @click="upload" :disabled="!Boolean(currentSpecimen)" :loading = "loadingMap.batchCriticalValue") 危急值上传
      .sampleAeeangement__right-actions
</template>

<script setup lang="ts">
import { type QueryPagination, useApi } from "@scmt/core-api";
import {
  type FormItemProps,
  type IAction,
  type TableProps,
  type EditFormProps,
  type DataPageProps,
  useNotify,
} from "@scmt/common-components";
import {
  type SpecimenEntity,
  type SpecimenQueryParams,
} from "@scmt/api-lis-specimen";
import { SectionTitle } from "@scmt/common-components";
import { type CriticalValueEntity } from "@scmt/api-lis-critical-value";
import {
  ESourceStatus,
  ESpeimenTableColumnKey,
  specimenColumns,
} from "@scmt/api-common";
import { useUser } from "@scmt/common-store";
import { useRequest } from "@scmt/common-hooks";
//添加 Props属性
const $api = useApi();
const user = useUser();
const $notify = useNotify();
const editingObj = ref<{} | CriticalValueEntity>({});
const currentSpecimen = ref<SpecimenEntity>();

const emit = defineEmits(["message-to-parent"]);
const queryPramas = reactive<SpecimenQueryParams>({
  states: 0,
  pageNum: 1,
  pageSize: 20,
});

const { request, data, loadingMap } = useRequest({
  tableData: (q: any) => {
    const params = Object.assign({}, queryPramas, q);
    return $api.lis.specimen.getSpecimenPageList(params);
  },

  getPorject: (id) => {
    return $api.lis.specimen.porject.get(id);
  },
  batchCriticalValue: (q) => {
    return $api.lis.criticalValue.batchCriticalValue(q).then(() => {
      $notify.success("发送成功");
    });
  },
});

onMounted(() => {
  request("tableData");
});

//危机值上传
const upload = () => {
  if (!editingObj?.value?.reportId) {
    $notify.error("发送人员不能为空");
    return;
  }
  request("batchCriticalValue", {
    baseProjectList: data.getPorject,
    specimenId: currentSpecimen.value.id,
    patientId: currentSpecimen.value.patientId,
    reportId: editingObj?.value?.reportId,
    remark: editingObj?.value?.remark,
    outpatientNumber: currentSpecimen.value.outpatientNumber,
    sourceId: currentSpecimen.value.sourceId,
    source: ESourceStatus.LIS,
    patientName: currentSpecimen.value.patientName,
  });
};

const editFormProps = computed<EditFormProps>(() => {
  const formItems: FormItemProps[] = [
    {
      prop: "remark",
      label: "备注内容",
      required: false,
      disabled: false,
    },
    {
      prop: "reportId",
      label: "发送人员",
      required: true,
      disabled: false,
      as: "select",
      options: {
        loadMethod: () => $api.user.listDoctorAsOptions({ officeId: "" }),
      },
    },
    {
      prop: "confirmId",
      label: "确认人员",
      required: false,
      disabled: true,
      as: "select",
      options: {
        loadMethod: () => $api.user.listDoctorAsOptions({ officeId: "" }),
      },
    },
    {
      prop: "confirmTime",
      label: "确认时间",
      disabled: true,
      required: false,
    },
    {
      prop: "feedback",
      label: "反馈结果",
      disabled: true,
      required: false,
    },
  ];

  const editProps: EditFormProps = {
    items: formItems,
    model: editingObj.value,
    columns: 1,
  };
  return editProps;
});

const pageParams = computed<DataPageProps>(() => {
  const queryFields: FormItemProps[] = [
    {
      prop: "barcode",
      label: "标本条码",
    },
    {
      prop: "barcode",
      label: "条码号",
    },
    {
      prop: "patientName",
      label: "患者姓名",
    },
    {
      prop: "inspectionTime",
      label: "检验时间",
      as: "date",
    },
  ];

  const dataPageProps: DataPageProps = {
    loading: loadingMap.tableData,
    queryModel: queryPramas,
    queryFields,
    onQuery: () => request("tableData"),
    onAct: onPageActions,
    columns: 2,
    noPadding: true,
    flex: true,
  };

  return dataPageProps;
});

const projectTableProps = computed(() => {
  const { tableData } = toRefs(data);

  const tableProps: TableProps = {
    loading: loadingMap.tableData,
    data: tableData.value?.items,
    pagination: tableData.value?.pagination,
    insertIndex: false,
    columns: [
      specimenColumns[ESpeimenTableColumnKey.Barcode],
      specimenColumns[ESpeimenTableColumnKey.PatientName],
      specimenColumns[ESpeimenTableColumnKey.ApplicationProject],
      specimenColumns[ESpeimenTableColumnKey.BillingDepartment],
      specimenColumns[ESpeimenTableColumnKey.BillingDoctor],
      {
        prop: "deviceName",
        label: "检验设备",
        tooltip: true,
        minWidth: 180,
      },
      {
        prop: "inspectionTime",
        label: "检验日期",
        tooltip: true,
        width: 170,
      },
    ],
    onAct: onPageActions,
    onPaginate: (pagination: QueryPagination) =>
      request("tableData", pagination),
    highlightCurrentRow: true,
    onRowClick: (row: any) => {
      currentSpecimen.value = $api.lis.specimen.$$createEntity(row);
      request("getPorject", row.id);
    },
  };
  return tableProps;
});

const tableProps = computed(() => {
  const { getPorject } = toRefs(data);

  const tableProps: TableProps = {
    loading: loadingMap.tableData,
    data: getPorject.value,
    columns: [
      {
        prop: "baseProjectName",
        label: "检验项目",
      },
      {
        prop: "result",
        label: "结果",
        tooltip: true,
      },
      {
        prop: "state",
        label: "状态",
        tooltip: true,
      },
      {
        prop: "unit",
        label: "单位",
        tooltip: true,
      },
      {
        prop: "reference",
        label: "参考",
        tooltip: true,
      },
    ],
    onAct: onPageActions,
    onPaginate: (pagination: QueryPagination) =>
      request("tableData", pagination),
    cellClassName: ({ row }) => {
      if (row.state === "↑" || row.state === "↓") {
        return "is--danger";
      }
    },
  };
  return tableProps;
});

const onPageActions = (action: IAction, model?: any) => {
  switch (action.event) {
    case "add":
      break;
    case "destroy":
      break;
  }
};
</script>

<style lang="less" scoped>
.sampleAeeangement {
  display: flex;
  width: 100%;
  height: 100%;
  overflow: hidden;

  &__left {
    flex: 4;
  }
  &__right {
    flex: 5;
    margin-left: var(--mt-margin);
    flex-direction: column;
    overflow: hidden;
    &-top {
      flex: 5;
    }

    &-form {
    }

    &__bottom {
      margin-top: var(--mt-margin);
    }

    &-actions {
      display: flex;
      justify-content: flex-end;
    }
  }
}

.specimen-info {
  height: 100%;
  display: flex;
  flex-direction: column;

  & > * + * {
    margin-top: var(--mt-margin);
  }

  &__title {
    flex-shrink: 0;
  }

  &__content {
    flex: 1;
    overflow: hidden;
  }
}

.inspection-result {
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;

  & > * + * {
    margin-top: var(--mt-margin);
  }

  &__title,
  &__form,
  &__actions {
    flex-shrink: 0;
  }

  &__table {
    flex: 1;
    overflow: hidden;
    :deep(.is--danger) {
      background-color: var(--el-color-danger) !important;
    }
  }

  &__actions {
    display: flex;
    justify-content: flex-end;
  }
}
</style>
